//----------------------------淡入淡出轮播图--------------------------
// 1、获取相应标签列表
var img_list = document.querySelectorAll(".banner_box li") // 待播放图片列表
var index = 0; // 定位下标
var len = img_list.length; // 列表长度
var bannerTimer = null; // 预留定时器变量

// 2、设置定时器-按照顺序进行自动轮播
// 2.1	定时器中执行函数， 给当前标签添加class，并去掉其他标签的class
function addClass(n){
	// 去掉所有class样式，此时所有图片和黑色圆点均不显示
	for (var i = 0; i < len; i++) {
		// 不显示图片
		if(img_list[i].className == "img_show"){
			img_list[i].className="";
		}
	}
	// 给当前的标签添加class
	img_list[n].className = "img_show"; // 显示指定顺序图片
}

// 2.2 	封装定时器方便调用
function autoPlay(){
	// 设置定时器
	bannerTimer = setInterval(function(){
		index ++;
		// 设置轮播下标，防止下标越界
		index = index == len ? 0 : index;
		addClass(index); // 调用函数
	},5750); // 每5s切换
}
autoPlay(); // 调用函数

var left = document.querySelector(".banner .btn-left"); // 获取左箭头位置标签
var right = document.querySelector(".banner .btn-right"); // 获取右箭头位置标签
// 设置手动翻页
// 点击左侧箭头实现向左翻页
left.onclick = function(){
	clearInterval(bannerTimer); // 清除定时器，实现鼠标点击后停止自动轮播
	index--;
	index = index == -1 ? len-1 : index; // 防止index越界
	addClass(index);
	// 鼠标离开后重启定时器
	left.onmouseout = function(){
		autoPlay();
	}
}
// 点击右侧箭头实现向右翻页
right.onclick = function(){
	clearInterval(bannerTimer);
	index++;
	index = index == len ? 0 : index;
	addClass(index);
	right.onmouseout = function(){
		autoPlay();
	}
}
//----------------------------淡入淡出轮播图--------------------------

var left;
function test(){
	left = $("#uls").position().left;
	$(".film_body .moduleBox .products_com .uls").css("width",$("#uls .img_li").length*305+"px");
	document.getElementById("uls").style.left=left-1+'px';
	var leftValue = -20-(305 * ($("#uls .img_li").length - 4));
	if(left < leftValue){
		$("#uls").css("left",-20);
	}
}

var timer ;
function start(){
	timer = setInterval(test, 20);
}
$(".img_li").mouseover(function(event) {
	clearInterval(timer);
});
$(".img_li").mouseout (function(event) {
	clearInterval(timer);
	start();
});
start();

var left1;
function test1(){
	$(".film_body .moduleBox .products_com .uls1").css("width",$("#uls1 .img_li1").length*305+"px");
	left1 = $("#uls1").position().left;
	$("#uls1").css("left",--left1+"px");
	var leftValue = -20-(305 * ($("#uls1 .img_li1").length - 4));
	if(left1 < leftValue){
		$("#uls1").css("left",-20);
	}
}

var timer1;
function start1(){
	timer1 = setInterval(test1, 20);
}
$(".imgs_divs").mouseover(function() {
	clearInterval(timer1);
});
$(".imgs_divs").mouseout (function() {
	clearInterval(timer1);
	start1();
});
start1();

//影城活动
$("#film1").click(function(event) {
	$("#film2").attr("class","");
	$("#film3").attr("class","");
	$("#film1").attr("class","active");
	$("#formTabContent").css("display","none");
	$("#formTabContent1").css("display","block");
	$("#formTabContent2").css("display","none");
});
$("#film2").click(function(event) {
	$("#film3").attr("class","");
	$("#film1").attr("class","");
	$("#film2").attr("class","active");
	$("#formTabContent").css("display","block");
	$("#formTabContent1").css("display","none");
	$("#formTabContent2").css("display","none");
});
$("#film3").click(function(event) {
	$("#film2").attr("class","");
	$("#film1").attr("class","");
	$("#film3").attr("class","active");
	$("#formTabContent").css("display","none");
	$("#formTabContent1").css("display","none");
	$("#formTabContent2").css("display","block");
});